<template>
	<view>
		<Header title="员工管理" ></Header>
		<view class="toubu">
			<!-- 搜索开始 -->
			<view class="content_content" style="width: calc(100% - 12rpx);">
				<view class="index_header ">
					<view class="content_header">
						<view>
							<image src="/static/image/index/sousuo.png" @click="onKeyInput"></image>
							<!-- <input class="search_neirong" v-model="search" :disabled="shows" type="text"
								placeholder="搜索商家" placeholder-class="index_placeholder"> -->
								<input class="search_neirong"  v-model="search" type="search" @confirm="onKeyInput" placeholder="搜索员工" placeholder-class="index_placeholder">
						</view>
					</view>
				</view>
			</view>
			<!-- 搜索结束 -->
			<view class="_list" >
				<view class="content_content_con yinying" v-for="item in xin" >
					<view class="zhuangtai">
						<view>账号：{{item.user_name}}</view>
						<view class="tingyong" v-if="item.status==1">账号已停用</view>
						<image  v-if="item.status==0" @click="publics.navigateTo('/view/me/xiugai_xinxi?userid='+item.userid)" src="../../static/image/me/xiugai_2.png" mode=""></image>
					</view>
					<view class="xinxi" @click="publics.navigateTo('/view/me/xiangqing_yg?userid='+item.userid)">
						<view class="all_xinxi">
							<view>姓名：{{item.nick_name}}</view>
							<view class="fangxiang">成交总金额：{{item.money}}元</view> 
						</view>
						<view class="all_xinxi">
							<view>有效客户率：{{item.youxiaonum}}</view>
							<view class="all">总成交量：{{item.allnum}}单</view>
						</view>
							
						
						<view>联系电话：{{item.phonenumber}}
						<image src="/static/image/me/dianhua.png" mode=""  @click.stop="publics.phone(item.phonenumber)"></image>
						</view>
					</view>
					
				</view>
			</view>
			
			<view class="grace-loading" v-if="xiala==0">上拉加载更多~</view>
			<view class="grace-loading" v-if="xiala==1 && zanwu != 1">没有更多数据啦~</view>
			<zanwushuju v-if="xin.length==0 && zanwu==1"></zanwushuju>
		</view>
		<tianjia :zhaungtai="1"></tianjia>
		<requestLoading></requestLoading>
	</view>
</template>

<script>
	import tianjia from "@/components/tianjia.vue"
	export default {
	 components:{
	  tianjia,
	 },
		data(){
			return{
				zanwu:1,
				xin:[],
				search:"",
				tishi: 1, //展示加载动画
				pagenum:1,
				xiala:999,
			}
		},
		onLoad(){
			
		},
		onShow:function(){
			if(this.tishi !=2){
				this.get_list()
			}
		},
		computed: {
		},
		onPullDownRefresh() {
		   	this.tishi=2;
			this.xiala=-1;
			this.pagenum=1;
			this.get_list()
			console.log("触发下拉刷新")
		}, 
		onReachBottom() {
			console.log("上拉加载")
				if(this.xiala===0){
						this.pagenum++;
						this.tishi=1;
						this.sift;
						this.get_list()
				}
		},
		methods:{
			get_list(){
				var that = this;
				this.configure.ajax({
					url: 'wode/staff',
					tishi: that.tishi,
					data: {
						pagenum:that.pagenum,
						search:that.search
					},
					method: 'POST',
					success: function(res) {
						if (res.data == null || res.data.length == 0) {
								that.xiala=1;
								return ;
						}else{
							that.xiala=0;
							if(that.tishi===2){
								that.xin=res.data
							}else{
								if(that.pagenum==1){
									that.xin=res.data
								}else{
									that.xin = that.xin.concat(res.data)
								}
							}
							
						}
						that.tishi='1111'
					}
				})
			},
			onKeyInput: function() {
				var patt1 = new RegExp(/\s+/g); //正则验证空格
				// if (this.search == '') {
				// 	uni.showToast({
				// 		title: '请输入关键字',
				// 		icon: "none"
				// 	});
				// 	return false;
				// } else if (patt1.test(this.search)) {
				// 	uni.showToast({
				// 		title: '请输入关键字',
				// 		icon: "none"
				// 	});
				// 	return false;
				// }
				this.get_list()
				// this.diyici = -1;
				console.log("1111111")
			},
		}
	}
</script>

<style lang="scss" scoped>
	.grace-loading{
		text-align: center;
		color: $qianhui_ziti;
		font-size: 30rpx;
		margin-top: 40rpx;
		margin-bottom: 40rpx;
	}
	.content_header{
		width:100% !important;
	}
	.zhuangtai{
		font-size: 26rpx;
		color:$heise_ziti;
		display: flex;
		justify-content: space-between;
		border-bottom: 2rpx solid var(--qianhui_eee);
		padding: 30rpx 0 24rpx 0;
		position: relative;
		image{
			width: 24rpx;
			height: 26rpx;
		}
	}
	.tingyong{
		color: $hongse_ty;
		width: 170rpx;
		height: 60rpx;
		background-color:$beijing;
		position: absolute;
		top: 0rpx;
		right: -28rpx;
		border-radius: 0rpx  12rpx  0rpx  12rpx  ;
		text-align: center;
		line-height:60rpx ;
	}
	.yinying{
		box-shadow: $shadow;
		color: $qianhuione_ziti;
	}
	.xinxi{
		font-size: 26rpx;
		color: $qianhuione_ziti;
		margin-bottom: 30rpx;
		
		view{
			padding-top: 24rpx;
		}
		image{
			width: 26rpx;
			height: 26rpx;
			padding-left: 12rpx;
			vertical-align: bottom;
		}
	}
	.all_xinxi{
		display: flex;
		justify-content: space-between;
		padding: 0rpx !important;
	}
	.fangxiang{
		width: 276rpx;
	}
	.all{
		margin-right:108rpx;
	}
	._list{
		margin-top: 140rpx;
	}
</style>